﻿<!DOCTYPE html>
{% extends "base.html" %}
<!-- 写入 base.html 中定义的 title -->
{% block title %}
    首页
{% endblock title %}

<!-- 写入 base.html 中定义的 content -->
{% block content %}
    <html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; Charset=gb2312">
        <meta http-equiv="Content-Language" content="zh-CN">
        <title>关于我们</title>

        <!-- 本页样式表 -->
        <link href="{% static 'css/about.css' %}" rel="stylesheet"/>
        <style>

        </style>
    </head>
    <body>
    <!-- 主体（一般只改变这里的内容） -->
    <div class="blog-body">
        <div class="blog-container">
            <blockquote class="layui-elem-quote sitemap layui-breadcrumb shadow">
                <a href="{% url 'common:home' %}" title="网站首页">网站首页</a>
                <a><cite>关于本站</cite></a>
            </blockquote>
            <div class="blog-main">
                <div class="layui-tab layui-tab-brief shadow" lay-filter="tabAbout">
                    <ul class="layui-tab-title">
                        <li lay-id="1">本站介绍</li>
                        <li lay-id="2" id="frinedlink">友情链接</li>
                        <li lay-id="3">留言墙</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item">
                            <div class="aboutinfo">
                                {% for blog in blogs %}
                                <div class="aboutinfo-figure">
                                    <img src="{{blog.site_logo.url}}" alt="Absolutely" />
                                </div>
                                
                                <p class="aboutinfo-nickname">{{ blog.site_name}}</p>
                                <p class="aboutinfo-introduce">{{blog.site_description}}</p>
                                <p class="aboutinfo-location"><i class="fa fa-location-arrow"></i>&nbsp;贵州 - 贵阳</p>
                                <hr />
                                 
                                <div class="aboutinfo-contact">
                                    <a target="_blank" title="QQ交流" href="javascript:layer.msg('启动QQ会话窗口')"><i class="fa fa-qq fa-2x"></i></a>
                                    <a target="_blank" title="给我写信" href="javascript:layer.msg('启动邮我窗口')"><i class="fa fa-envelope fa-2x"></i></a>
                                    <a target="_blank" title="新浪微博" href="javascript:layer.msg('转到你的微博主页')"><i class="fa fa-weibo fa-2x"></i></a>
                                    <a target="_blank" title="码云" href="javascript:layer.msg('转到你的github主页')"><i class="fa fa-git fa-2x"></i></a>
                                </div>
                                <fieldset class="layui-elem-field layui-field-title">
                                    <legend>简介</legend>
                                    <div class="layui-field-box aboutinfo-abstract abstract-bloger">
                                        <h1>个人信息</h1><br>
                                            <p>网站名称：{{ blog.site_name }}</p><br>
                                            <p>QQ：{{ blog.site_QQ}}</p><br>
                                            <p>邮箱：{{ blog.site_email }}</p><br>
                                            <p>微信：{{ blog.site_wetch }}</p><br>
                                            <h1>站点描述</h1><br>
                                            <p>{{ blog.site_description}}</p>
                                        <h1 style="text-align:center;">The End</h1>
                                    </div>
                                </fieldset>
                                {% endfor %}
                            </div>
                        </div><!--关于作者End-->
                        <div class="layui-tab-item">
                            <div class="aboutinfo">
                                <div class="aboutinfo-figure"></div>
                                <p class="aboutinfo-nickname">友情链接</p>
                                <p class="aboutinfo-introduce">Name：川塔&nbsp;&nbsp;&nbsp;&nbsp;Site：www.lyblogs.cn</p>
                                <p class="aboutinfo-location">
                                    <i class="fa fa-close"></i>经常宕机&nbsp;
                                    <i class="fa fa-close"></i>不合法规&nbsp;
                                    <i class="fa fa-close"></i>插边球站&nbsp;
                                    <i class="fa fa-close"></i>红标报毒&nbsp;
                                    <i class="fa fa-check"></i>原创优先&nbsp;
                                    <i class="fa fa-check"></i>技术优先
                                </p>
                                <hr/>
                                <div class="aboutinfo-contact">
                                    <p style="font-size:2em;">互换友链，携手并进！</p>
                                </div>
                                <fieldset class="layui-elem-field layui-field-title">
                                    <div class="layui-field-box">
                                        <ul class="friendlink">
                                            {% for link in links %}
                                                <li>
                                                    <a target="_blank" href="{{ link.linkurl }}" title="{{ link.name }}"
                                                       class="friendlink-item">
                                                        <p class="friendlink-item-pic"><img
                                                                src="https://www.baidu.com/img/flexible/logo/pc/result@2.png"
                                                                alt="Layui"/></p>
                                                        <p class="friendlink-item-title">{{ link.name }}</p>
                                                        <p class="friendlink-item-domain">{{ link.linkurl }}</p>
                                                    </a>
                                                </li>
                                            {% endfor %}
                                        </ul>
                                    </div>
                                </fieldset>
                            </div>
                        </div><!--友情链接End-->
                        <div class="layui-tab-item">
                            <div class="aboutinfo">
                                <div class="aboutinfo-figure"></div>
                                <p class="aboutinfo-nickname">留言墙</p>
                                <p class="aboutinfo-introduce">本页面可留言、吐槽、提问。欢迎灌水，杜绝广告！</p>
                                <p class="aboutinfo-location">
                                    <i class="fa fa-clock-o"></i>&nbsp;<span id="time"></span>
                                </p>
                                <hr/>
                                <div class="aboutinfo-contact">
                                    <p style="font-size:2em;">沟通交流，拉近你我！</p>
                                </div>
                                <fieldset class="layui-elem-field layui-field-title">
                                    <legend>Leave a message</legend>
                                    <div class="layui-field-box">
                                        <div class="leavemessage" style="text-align:initial">

                                            <form action="." method="post" class="basic-grey">
                                                {% csrf_token %}
                                                <h1>留言信箱
                                                    <span>请留下你的留言或建议</span>
                                                </h1>
                                                <label><span>你的电话号码 :</span>
                                                   <input id="phone" type="text" name="phone"/>
                                                </label>
                                                <label><span>你的姓名 :</span>
                                                    <input id="name" type="text" name="name"/>
                                                </label>
                                                <label><span>你的邮箱 :</span>
                                                    <input id="email" type="email" name="email"/>
                                                </label>

                                                <label><span>留言 :</span>
                                                    <textarea id="message" name="message"></textarea>
                                                </label>
                                                <label><span>建议 :</span>
                                                        <textarea id="suggest" name="suggest"></textarea>
                                                </label>
                                                <label><span>&nbsp;</span>
                                                    <input type="submit" class="button" value="提交留言"/>
                                                </label>

                                            </form>
                                        </div>
                                    </div>
                                </fieldset>
                            </div>
                        </div><!--留言墙End-->
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 本页脚本 -->
    <script src="{% static 'js/about.js' %}"></script>


{% endblock content %}
</body>
</html>